在進入實作之前，做最後小小介紹 Fabric.js 的歷史沿革：

起源

Fabric.js 於2010年由 Juriy Zaytsev（也被稱為"kangax"）創建。
Juriy Zaytsev 想為他的創業公司 printio.ru 創建一個互動設計編輯器。這個編輯器允許用戶設計自己的服裝，而當時只有 Flash 能夠提供所需的互動性。
最初的目標為了解決使用原生 canvas 畫布 API 的困難，並創建一個更高效的解決方案。

主要動機：

• 簡化 HTML5 canvas 的使用
• 提供類似於 Flash 的互動性
• 建立一個物件模型來管理 canvas 元素

早期發展 (2010-2013)

Fabric.js 最初專注於提供當時市面上沒有、可管理的 canvas 元素物件模型，建立核心功能和API，讓開發者可以更方便地操作畫布上的圖形。

• 0.9版本: 首次公開發布
• 1.0版本 (2012): 穩定的API，引入基本形狀和圖片處理
• 1.2版本 (2013): 增加了文本支持和基本動畫

成熟期 (2014-2017)

這個時期Fabric.js 顯著增加了對 SVG 解析、事件處理和動畫的支持，逐漸成為一個功能豐富的畫布操作工具。

• 1.4版本 (2014): 引入群組功能，改進SVG解析
• 1.5版本 (2015): 增加了漸變和圖案填充
• 1.7版本 (2016): 改進了性能，增加了新的濾鏡效果
• 2.0版本 (2017): 主要的架構重構，提高了模塊化

現代化階段 (2018-現在)

近年來，Fabric.js 專注於現代化和性能優化:

• 3.0版本 (2018): ES6模塊支持，棄用了一些舊API
• 4.0版本 (2020): 重大更新，改進了類型定義，增強了與現代框架的兼容性
• 5.0版本 (2022): 進一步優化性能，增加新特性如筆刷工具

主要架構變化

隨著時間推移，整體而言 Fabric.js 的架構經歷了幾次重大變革：

• 從全局命名空間到模塊化結構
• 引入 TypeScript 定義，增強類型安全
• 重構渲染引擎，提高性能
• 增強事件系統，改進互動性

開源的 Fabric.js V.S. 社區貢獻

作為一個開源項目，Fabric.js 吸引了大量開發者的關注和貢獻。
Fabric.js 的發展很大程度上得益於其活躍的社區，社區的參與使得該庫得以快速迭代和改進。

• 目前在 GitHub上有超過 28.4k 顆星
• 豐富的外掛和擴展生態系統
• 有數百個貢獻者
• 許多開發者為 Fabric.js 提供了插件和擴展，進一步豐富了其功能

性能優化

• 隨著用戶需求的增加、時代演進，Fabric.js 不斷進行性能優化，以確保在處理大量圖形物件時仍能保持高效。
• 引入了性能優化技術，提升了渲染性能和用戶體驗：
  • 虛擬畫布：當畫布上的只有部分需要更新，只重繪那些改變的部分，而不是整個畫布）
  • 增量渲染：逐步更新畫布上的內容，而不是一次性完成所有的渲染操作。可以有效地分散渲染負載，避免性能瓶頸

總的來說，Fabric.js 的發展歷程反映了 Web 技術的演進，從簡單的 canvas 抽象到複雜的互動式圖形庫。

根據目前的趨勢和社區討論，它的未來發展將繼續聚焦於性能、易用性和與現代 Web 開發實踐的整合（增強與現代前端框架(ex:React, Vue)的整合、改進移動設備上的觸控支持等）。